<template>
	<view>
		
		<view>
			<view>
				<view1.容器组件></view>
				<view class="smart-item" @click="goDetailPage{'view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'scroll-view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'swiper'}"><text>view视图</text></view>
			</view>
			<view>
				<view2.基础内容></view>
				<view class="smart-item" @click="goDetailPage{'view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'scroll-view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'swiper'}"><text>view视图</text></view>
			</view>
			<view>
				<view3.表单组件></view>
				<view class="smart-item" @click="goDetailPage{'view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'scroll-view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'swiper'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'scroll-view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'swiper'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'scroll-view'}"><text>view视图</text></view>
				<view class="smart-item" @click="goDetailPage{'swiper'}"><text>view视图</text></view>
			</view>
			<view4.媒体组件></view>
			<view class="smart-item" @click="goDetailPage{'view'}"><text>view视图</text></view>
			<view class="smart-item" @click="goDetailPage{'scroll-view'}"><text>view视图</text></view>
			<view class="smart-item" @click="goDetailPage{'swiper'}"><text>view视图</text></view>
			<view5.地图组件></view>
			<view class="smart-item" @click="goDetailPage{'view'}"><text>view视图</text></view>
			<view class="smart-item" @click="goDetailPage{'scroll-view'}"><text>view视图</text></view>
			<view class="smart-item" @click="goDetailPage{'swiper'}"><text>view视图</text></view>
		</view>
		<view6.导航组件></view>
		<view class="smart-item" @click="goDetailPage{'view'}"><text>view视图</text></view>
		<view class="smart-item" @click="goDetailPage{'scroll-view'}"><text>view视图</text></view>
		<view class="smart-item" @click="goDetailPage{'swiper'}"><text>view视图</text></view>
	</view>
</template>

<script>
	
	
	export default{
		data(){
			return{
				
			}
		},
		methods: {
			goDetailPage(e) {
				console.log(e);
				//跳转
				uni.navigateTo({
					url: '/pages/components/'+ e +'/' + e,
					success: res => {},
					fail: () => {},
					complete: () => {}
				});
			}
		}
	}
	
</script>

<style>
	.smart-item {
			background-color: #F1F1F1;
			/*背景色*/
			font-size: 40upx;
			/*字体大小*/
			margin: 20upx;
			/*外间距*/
			height: 80upx;
			/*行高*/
			line-height: 80upx;
			padding-left: 30upx;
		}
</style>